﻿/// <reference path="../Core.ts" />

module Supernova {

    export class MainMenuUI implements UI.ISwitchableUI {

        layout = {
            rootPanel: {
                top: 50, width: 400, bottom: 0,
                controls: {
                    mainMenuPanel: {
                        controls: {
                            welcomeTitle: {
                                top: 0, height: 30,
                                text: 'Supernova (' + VERSION + ')'
                            },
                            singlePlayerButton: {
                                top: 40, width: 300, height: 40,
                                text: 'New Single Player Game',
                                onClick: this.handleSinglePlayerButtonClick
                            },
                            multiplayerButton: {
                                top: 90, width: 300, height: 40,
                                text: 'New Multiplayer Game',
                                onClick: this.handleMultiplayerButtonClick
                            },
                            optionsButton: {
                                top: 140, width: 300, height: 40,
                                text: 'Options',
                                onClick: this.handleOptionsButtonClicked
                            },
                            helpButton: {
                                top: 190, width: 300, height: 40,
                                text: 'Help (Improved!)',
                                onClick: this.handleHelpButtonClicked
                            },
                            redditButton: {
                                top: 240, width: 300, height: 40,
                                text: 'Reddit Community',
                                onClick: this.handleRedditButtonClicked
                            }
                        }
                    },
                    singlePlayerPanel: {
                        visible: false,
                        controls: {
                            newGameTitle: {
                                top: 0, height: 30,
                                text: 'Start New Game',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty1RadioButton: {
                                top: 40, width: 400, height: 24, tag: 0,
                                text: 'Difficulty Level 1',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty2RadioButton: {
                                top: 74, width: 400, height: 24, tag: 1,
                                text: 'Difficulty Level 2',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty3RadioButton: {
                                top: 108, width: 400, height: 24, tag: 2,
                                text: 'Difficulty Level 3',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty4RadioButton: {
                                top: 142, width: 400, height: 24, tag: 3,
                                text: 'Difficulty Level 4',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty5RadioButton: {
                                top: 176, width: 400, height: 24, tag: 4,
                                text: 'Difficulty Level 5',
                                onChecked: this.handleDifficultyChanged
                            },
                            difficulty6RadioButton: {
                                top: 210, width: 400, height: 24, tag: 5,
                                text: 'Difficulty Level 6',
                                onChecked: this.handleDifficultyChanged
                            },
                            startSinglePlayerGameButton: {
                                left: 0, top: 244, height: 40, width: 80,
                                text: "Start",
                                onClick: this.handleStartSinglePlayerButtonClicked
                            },
                            cancelButton: {
                                left: 90, top: 244, height: 40, width: 80,
                                text: "Cancel",
                                onClick: this.handleCancelButtonClicked
                            }
                        }
                    }
                }
            }
        }

        public root: UI.UIControl = null;

        constructor() {
            this.root = UI.compile(this.layout)[0];
        }

        show() {
            var radio1 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty1RadioButton');
            var radio2 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty2RadioButton');
            var radio3 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty3RadioButton');
            var radio4 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty4RadioButton');
            var radio5 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty5RadioButton');
            var radio6 = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty6RadioButton');
            radio1.isChecked = false;
            radio1.text = generatorProfiles[0].name;
            radio2.isChecked = false;
            radio2.text = generatorProfiles[1].name;
            radio3.isChecked = false;
            radio3.text = generatorProfiles[2].name;
            radio4.isChecked = false;
            radio4.text = generatorProfiles[3].name;
            radio5.isChecked = false;
            radio5.text = generatorProfiles[4].name;
            radio6.isChecked = false;
            radio6.text = generatorProfiles[5].name;
            var firstRadioButton = UI.getControlByName<UI.RadioButton>(UI.root, 'difficulty1RadioButton');
            firstRadioButton.isChecked = true;
            this.handleDifficultyChanged(firstRadioButton, null);
            this.handleCancelButtonClicked(null, null);
        }

        hide() {
            Notices.clearMessages();
        }

        private handleSinglePlayerButtonClick(sender, e) {
            UI.getControlByName(UI.root, 'mainMenuPanel').visible = false;
            UI.getControlByName(UI.root, 'singlePlayerPanel').visible = true;
        }

        handleMultiplayerButtonClick(sender, e) {
            UI.swap(serverSelectionUI, UI.Bounds.create(canvas));
        }

        handleOptionsButtonClicked(sender, e) {
            UI.swap(optionsUI, UI.Bounds.create(canvas));
        }

        handleHelpButtonClicked(sender, e) {
            window.open('help.html', '_blank');
        }

        handleRedditButtonClicked(sender, e) {
            window.open('http://www.reddit.com/r/supernovawebgame/', '_blank');
        }

        handleDifficultyChanged(sender, e) {
            var radioButton = <UI.RadioButton>sender;
            generatorProfile = generatorProfiles[radioButton.tag];
        }

        handleStartSinglePlayerButtonClicked(sender, e) {
            newGame(GameMode.singlePlayer);
        }

        handleCancelButtonClicked(sender, e) {
            UI.getControlByName(UI.root, 'mainMenuPanel').visible = true;
            UI.getControlByName(UI.root, 'singlePlayerPanel').visible = false;
        }

    }

}